<template>
	<view class="change-password">
		<u-toast ref="uToast" />
		<u-form :model="form" ref="uForm" class="change-password__form">
			<u-form-item prop="oldPassword" class="change-password__form--item" label="原密码" label-width="200">
				<u-input v-model="form.oldPassword" placeholder="请输入原密码" type="password" password-icon
					:clearable="false" />
			</u-form-item>
			<u-form-item prop="newPassword" class="change-password__form--item" label="新密码" label-width="200">
				<u-input v-model="form.newPassword" placeholder="请输入新密码" type="password" password-icon
					:clearable="false" />
			</u-form-item>
			<u-form-item prop="confirmPassword" class="change-password__form--item" label="确认密码" label-width="200">
				<u-input v-model="form.confirmPassword" placeholder="请再次输入新密码" type="password" password-icon
					:clearable="false" />
			</u-form-item>
		</u-form>
		<view class="mt-28" style="padding: 0 30rpx">
			<!-- <u-alert-tips type="warning" title="提示" :description="description"></u-alert-tips> -->

			<u-button class="mt-40 custom-style" type="primary" @click="submit">确认修改</u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				description: "密码必须包含字母以及数字，并且长度为6-20位",
				form: {
					oldPassword: null,
					newPassword: null,
					confirmPassword: null,
				},
				rules: {
					oldPassword: [{
						required: true,
						message: "请输入旧密码",
						trigger: ["change", "blur"],
					}, ],
					newPassword: [{
						required: true,
						message: "请输入新密码",
						trigger: ["change", "blur"],
					}, ],
					confirmPassword: [{
						required: true,
						message: "请输入新密码",
						trigger: ["change", "blur"],
					}, ],
				},
				param: {
					oldPassword: null,
					newPassword: null,
				}
			};
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		methods: {
			submit() {
				this.$refs.uForm.validate((valid) => {
					if (valid) {
						// 比较两次输入的新密码是否一样
						if (this.form.newPassword !== this.form.confirmPassword) {
							this.$refs.uToast.show({
								title: "两次输入不一样",
								type: "error",
							});
							return;
						}
						// 处理修改逻辑
						this.param.oldPassword = this.$zx.md5Str(this.form.oldPassword);
						this.param.newPassword = this.$zx.md5Str(this.form.newPassword);
						this.$zx.user_api.myInfoUpdatePassword(this.param).then(() => {
							this.$refs.uToast.show({
								title: "修改成功",
								type: "success",
							});
							uni.removeStorageSync("token");
							uni.removeStorageSync("login_role");
							setTimeout(function() {
								uni.reLaunch({
									url: "/pages/main/login/login",
								});
							}, 2000);
						});

					} else {
						//校验错误
					}
				});
			},
		},
	};
</script>

<style scoped lang="scss">
	.change-password {
		padding: 0;
		background-color: white;

		&__form {
			background-color: #ffffff;

			&--item {
				padding: 30rpx 24rpx;
			}
		}
	}

	.custom-style {
		height: 88rpx;
		background-color: $zx-theme-color !important;
	}
</style>